<template>
  <div>
    <el-table border
      class="inputcolumn"
      :data="selectedDataCopy"
      style="width: 1000px">

      <el-table-column prop="deviceImage"
        label="图片"
        align="center"
        width="100">
        <template slot-scope="scope">
          <el-image v-if="
            scope.row.itemMainImage != null && scope.row.itemMainImage != ''
          "
            slot="reference"
            :src="scope.row.itemMainImage"
            class="image-rows"
            :preview-src-list="[scope.row.itemMainImage]">
          </el-image>
        </template>
      </el-table-column>
      <el-table-column prop="itemName"
        label="项目名称"
        width="100"
        align="left" />
      <el-table-column prop="itemName" label="sku" width="140" align="left">
        <template slot-scope="scope">
          <el-select  :disabled="!canDelete" style="width: 100%;" v-model="scope.row.skuId" placeholder="请选择sku"  size="small" v-if="scope.row.proboxServiceItemSkus &&
          scope.row.proboxServiceItemSkus.length > 0">
            <!-- <el-option label="无" value="0" /> -->
            <el-option   v-for="dict in  scope.row.proboxServiceItemSkus" :key="dict.skuId" :label="dict.skuName"
              :value="dict.skuId" />
          </el-select>
        </template>
      </el-table-column>
      <el-table-column label="面价"
        align="center"
        prop="itemPriceStr" />
      <el-table-column label="活动价格"
        align="center"
        prop="itemFavorablePriceStr" />
      <el-table-column label="结算价格"
        align="center"
        prop="itemSettlementPriceStr" />
      <el-table-column label="项目类别"
        align="center"
        prop="itemTypeStr" />
      <el-table-column label="是否投放门店"
        width="100px"
        align="center"
        prop="isCommon">
        <template slot-scope="scope">
          <span>{{ scope.row.isCommon == '1' ? '通用' : '指定门店' }}</span>
        </template>
      </el-table-column>

      <el-table-column align="center"
        prop="receiveNumber"
        label="操作"
        v-if="canDelete">
        <template slot-scope="scope">
          <el-button size="mini"
            @click="handleDeleteser(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

  </div>
</template>
<script>
export default {
  props: {
    selectedData: {
      type: Object,
      default: function () {
        return {}
      }
    },
    canDelete: {
      type: Boolean,
      default: true
    }
  },
  data () {
    return {
      selectedDataCopy: [],
      pageSizess: [5, 10, 15, 20, 25, 30, 50],
      pageNum: 1,
      pageSize: 5,

    }
  },

  created () {
    this.getList();
  },
  methods: {
    getList () {
      this.selectedDataCopy = [];

      this.selectedDataCopy.push(this.selectedData);

    },
    handleDeleteser (val, row) {
      // 模态框删除按钮
      this.$confirm("是否确认删除本条数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "info",
      }).then(() => {
        this.selectedDataCopy = [];
        //数据回传
        this.$emit('tabRespon')
      });
    },
  },
};
</script>
